﻿<div>
    <h1> this is for angular index</h1><br />

    <h3>Featured Project</h3>
    <div class="jumbotron">
        <div class="row" ng-click="">
            <div class="col-sm-5">
                <img ng-src="{{featured.Image}}" />
            </div>
            <div class="col-sm-6">
                <div>
                    <strong>Project Name:</strong><br />
                    {{featured.Name}}
                </div>
                <div>
                    <strong>Description:</strong> <br />
                    {{featured.Description}}
                </div>
            </div>
        </div>
    </div>

    <div>
        <h3>List Of Posts<button class="btn btn-success btn-sm pull-right" ng-click="AddNewPost()">Add New Post</button></h3>
        <div class="text-center">
            <button ng-disabled="currentPage == 0" ng-click="currentPage=currentPage-1">
                Previous
            </button>
            {{currentPage+1}}/{{numberOfPages()}}
            <button ng-disabled="currentPage >= posts.length/pageSize - 1" ng-click="currentPage=currentPage+1">
                Next
            </button>
        </div>
    </div>
</div>
<!--<h3>List Of Projects</h3>
<table class="table table-bordered table-hover" style="width:100%">
    <tr>
        <th>Project Image</th>
        <th>Project Name</th>
        <th>Project Description</th>
        <th>Codeplex Link For Source Code</th>
    </tr>
    <tr ng-repeat="project in projects">
        <td><img ng-src="{{project.Image}}" style="width:50px; height:50px" /></td>
        <td class="col-sm-2">{{project.Name}}</td>
        <td>{{project.Description}}</td>
        <td><a ng-href="{{project.CodeplexLink}}">{{project.CodeplexLink}}</a></td>
    </tr>
</table>-->

<div>
    <table class="table table-bordered table-hover" style="width:100%">
        <tr>
            <th>Title</th>
            <th colspan="2">Content</th>
        </tr>
        <tr ng-repeat="post in posts | startFrom:currentPage*pageSize | limitTo:pageSize">
            <td class="col-md-2">{{post.Title}}</td>
            <td>{{post.Content}}<button class="glyphicon-pencil pull-right"></button></td>
            
        </tr>
    </table>


</div>